<template>
  <div class="avatar">
    <img src="@/assets/images/1.jpeg" class="img" :style="{
      width: props.avatar.size + 'px',
      height: props.avatar.size + 'px'
    }" />
  </div>
</template>
<script setup>
import { defineProps } from 'vue'
const props = defineProps(['avatar'])

console.log(props.avatar, 'avatar')
</script>


<style lang="scss" scoped>
.avatar{
  display:flex;
  align-items:center;
  justify-content:center;
}
.img {
  display: inline-block;
  // border:20px solid #fff;
  border-radius: 50%;
  object-fit: cover;
  // 照片铺满
}
</style>